<!--
 * Copyright (c) 2009, Gareth Bond, http://www.gazbond.co.uk
 * All rights reserved.
 *
 * Redistribution and use in source and binary forms, with or without modification, are permitted provided
 * that the following conditions are met:
 *
 *   * Redistributions of source code must retain the above copyright notice, this list of conditions and the
 *     following disclaimer.
 *   * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and
 *     the following disclaimer in the documentation and/or other materials provided with the distribution.
 *   * Neither the name of Yii Software LLC nor the names of its contributors may be used to endorse or
 *     promote products derived from this software without specific prior written permission.
 *
 * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED
 * WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
 * PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY
 * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
 * HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
 * THE POSSIBILITY OF SUCH DAMAGE.
 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>RpcServlet Random</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="jquery-rpc-client.js"></script>
        <script type="text/javascript">

            /**
             * URL of RPC service.
             */
            var url = 'services/random';

            /**
             * Reference to length element selector.
             */
            var lengthSel = null;

            /**
             * Reference to result element selector.
             */
            var resultSel = null;

            /**
             * Print to the console element.
             */
            function print(value) {
                
                $('#console').append(value + '\n');
            }

            /**
             * Initialize applicaion.
             */
            $(document).ready(function() {
                
                //set length element selector reference
                lengthSel = $('#length');
                
                //set result element selector reference
                resultSel = $('#result');

                /**
                 * Add event handler to create button.
                 */
                $('#create').click(function() {
                    
                    //convert user entered length
                    var length = parseInt(lengthSel.val());

                    //is length valid - an integer and between 1 and 100
                    if(isNaN(length) || length < 1 || length > 100) {

                        //alert user to validation error
                        alert('Please enter a valid length (1 - 100)');
                        
                        //clear length element
                        lengthSel.val('');
                    }
                    else {
                        
                        //print remote call info
                        print('invoking:  createRandomString(' + length + ')');
                        
                        //execute remote call - createRandomString with length param
                        $.rpc.invoke(url, 'createRandomString', length, function(data) {

                            //print response of remote call
                            print('response: ');
                            print($.rpc.serialize(data, 2));
                            print('--------------------------------------------------------------');

                            //put response into result element
                            resultSel.html(data['return']['created']);
                        });
                    }
                });

                /**
                 * Add event handler to clear button.
                 */
                $('#clear').click(function() {
                
                    //clear result element
                    resultSel.html('');
                });

                /**
                 * Add event handler to reload button.
                 */
                $('#reload').click(function() {

                    //print remote call info
                    print('invoking:  getLastRandomString()');

                    //execute remote call - getLastRandomString
                    $.rpc.invoke(url, 'getLastRandomString', null, function(data) {

                        //print response of remote call
                        print('response: ');
                        print($.rpc.serialize(data, 2));
                        print('--------------------------------------------------------------');

                        //put response into result element
                        resultSel.html(data['return']);
                    });
                });
            });
            
        </script>
    </head>
    <body>
        <h3>RpcServlet Random</h3>
        <div>
            <h4>Create Random String:</h4>
            <label>Length:</label>
            <input id="length" type="text">
            <button id="create" >Create</button>
        </div>
        <div>
            <h4>Result:</h4>
            <p id="result"></p>
            <button id="clear">Clear</button>
            <button id="reload">Reload</button>
        </div>
        <div>
            <h4>Console:</h4>
            <pre style="overflow:auto; width:75%; height:300px; padding:10px; border:1px solid;"
                 id="console"></pre>
        </div>
    </body>
</html>
